<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>请求拦截器</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
</head>
<body>
  <script>
    // Promise
    // 设置请求拦截器
    axios.interceptors.request.use(function(config) {
      console.log('请求拦截器 成功 1号')
      // 修改config中的参数
      config.params = {a:100}
      console.log(config) // 配置对象
      // throw '参数出了问题'
      return config;
    }, function (error) {
      console.log('请求拦截器 失败 1号')
      return Promise.reject(error)
    })

    axios.interceptors.request.use(function(config) {
      console.log('请求拦截器 成功 2号')
      // 修改config中的参数
      config.timeout = 2000
      console.log(config) // 配置对象
      return config;
    }, function (error) {
      console.log('请求拦截器 失败 2号')
      return Promise.reject(error)
    })

    axios.interceptors.response.use(function(reponse) {
      console.log('响应拦截器 成功 1号')
      console.log(reponse)
      return reponse.data;
    }, function (error) {
      console.log('响应拦截器 失败 1号')
      return Promise.reject(error)
    })

    axios.interceptors.response.use(function(reponse) {
      console.log('响应拦截器 成功 2号')
      return reponse;
    }, function (error) {
      console.log('响应拦截器 失败 2号')
      return Promise.reject(error)
    })

    // 发送请求
    axios({
      methos: 'GET',
      url: 'http://localhost:3000/posts'
    }).then(response => {
      console.log(response, '返回结果')
    }).catch(error => {
      console.log(error)
    })
  </script>
</body>
</html>